<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-icon-back mui-icon"></a>
			<h1 class="mui-title">注册</h1>
		</header>
		<div class="mui-content">
			<ul class="mui-list-unstyled">
				<li class="mui-list-unstyled">
					<label>用户名:</label>
					<input placeholder="请输入用户名" type="text" name="user_name" />
				</li>
				<li class="mui-list-unstyled">
					<label>密码:</label>
					<input placeholder="请输入用户密码" type="password" name="password" />
				</li>
				<li class="mui-list-unstyled">
					<label>确认密码:</label>
					<input placeholder="请再次输入用户密码" type="password" name="repassword" />
				</li>
			</ul>
			<button class="mui-btn-blue">登录</button>
			<button class="mui-btn-green mui-pull-right">注册</button>

		</div>

		<script src="../js/mui.min.js"></script>
		<script type="text/javascript">
			mui.init()
			mui.plusReady(function() {
				var user_name = document.querySelectorAll('input')[0];
				var user_password = document.querySelectorAll('input')[1];
				var user_repassword = document.querySelectorAll('input')[2];

				mui('.mui-content').on('tap', '.mui-btn-blue', function() {
					mui.back()
				})
				
				mui('.mui-bar').on('tap', '#header-icon-back', function() {
					mui.back()
				})

				mui('.mui-content').on('tap', '.mui-btn-green', function() {
					if(user_name.value == '') {
						mui.toast('用户名不能为空！')
						return
					}
					if(user_password.value == '') {
						mui.toast('密码不能为空！')
						return
					}
					if(user_repassword.value == '') {
						mui.toast('二次输入密码不能为空！')
						return
					}
					if(user_repassword.value != user_password.value) {
						mui.toast('两次密码必须一致')
						return
					}

					mui.post('https://www.baidu.com', {
						userName: user_name.value,
						userPassword: user_password.value,
						userRePassword: user_repassword.value,
					}, function(data) {
						mui.openWindow('main.html', 'index_new')
					})
				})

			})
		</script>
	</body>

</html>